<template>
    <div class="text-white z-8000   flex items-center w-full h-full" style="background:#15559a">
        <el-col :span="3" class="flex justify-center items-center">
            <i class="el-icon-s-flag w-8"></i>
            <span class="hidden md:block">后台管理系统</span>
        </el-col>
        <el-col :span="18" class="flex justify-center items-center">
            <span>宣汉绿之源家政服务有限公司</span>
        </el-col>
        <el-col :span="3" class="flex justify-end items-center">
            <el-badge class="item " is-dot>
                <i class="el-icon-message-solid">
                </i>
            </el-badge>
            <el-dropdown @command="handleCommand">
                <el-avatar src="/static/picture/logo_01.gif"></el-avatar>
                <i class="el-icon-caret-bottom text-white text-sm"></i>
                <el-dropdown-menu slot="dropdown">
                    <el-dropdown-item>个人资料</el-dropdown-item>
                    <el-dropdown-item command="admin.message.index">
                        <el-badge class="item text-sm" is-dot>
                            最新发表
                        </el-badge>
                    </el-dropdown-item>
                    <el-dropdown-item>{{ $store.state.user.name }}</el-dropdown-item>
                    <el-dropdown-item command="user/logout">退出登录</el-dropdown-item>
                </el-dropdown-menu>
            </el-dropdown>
        </el-col>
    </div>

</template>

<script>
export default {

    methods: {
        async handleCommand(command) {
            if (command == 'user/logout') {
                await this.axios.post(command)
                localStorage.removeItem('token');
                location.href = '/login';
            } else {
                this.$router.push({'name': command})
            }

        },
    }
}
</script>


<style>

</style>
